<template>
  <div class="main">
    <Header />
    <div class="content">
      <Menu :menuList="menuList" class="menu" />
      <div class="page">
        <!-- 组件缓存 -->
        <!-- 分页关联子路由 -->
        <!-- 关联子路由之后 从售前项目查看某个工时再点击其他菜单后，再次点击项目管理仍显示在查看工时页面,所以注销了这段代码 -->
        <!-- <keep-alive>
          <router-view v-if="$route.meta.keepAlive" />
        </keep-alive>-->
        <router-view />
      </div>
    </div>
  </div>
</template>
<script>
import Header from "@/views/element/Header";

import Menu from "@/views/element/NavMenu";
import { getUserAuthResourceListone } from "@/service/Api.js"; //接口

import bus from "../components/bus";

export default {
  name: "Pc",
  components: { Header, Menu },
  data() {
    return {
      menuList: []
    };
  },
  methods: {
    //判断该账号的权限对应的一级菜单的显示与隐藏
    async getUserOnelist() {
      try {
        let data = await getUserAuthResourceListone().then(res => res.data);
        this.menuList = data; // 一级菜单数据
      } catch (error) {
        console.log(error);
      }
    }
  },
  created() {
    bus.$on("setRole", val => {
      this.getUserOnelist();
      console.log("setSuccess");
    });
    this.getUserOnelist();
  }
};
</script>
<style scoped>
.main {
  width: 100%;
  height: 100%;
}
.content {
  position: absolute;
  width: 100%;
  height: calc(100% - 60px);
  top: 60px;
}
.menu {
  width: 100%;
}
.page {
  box-sizing: border-box;
  height: calc(100% - 50px);
  overflow: auto;
}
/* 滚动条 */
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
  background-color: rgba(0, 185, 141);
}
::-webkit-scrollbar-track {
  box-shadow: inset 0 0 6px rgba(0, 185, 141, 0.3);
  border-radius: 10px;
  background-color: rgba(0, 185, 141);
}
::-webkit-scrollbar-thumb {
  border-radius: 10px;
  box-shadow: inset 0 0 6px #155440;
  background-color: #155440;
}
</style>

